import { useToggle, useList } from 'react-use'

function MyToggle() {
    const [isOn, toggle] = useToggle(false)
    return <div>
        开关状态: {isOn ? '开' : '关'}
        <button onClick={toggle}>切换开关</button>
    </div>
}

function MyList() {
    const [todos, { push, removeAt, set, clear, reset }] = useList([])
    return <div>
        <button onClick={() => push('新内容')}>添加内容</button>
        <ul>
            {todos.map((item, index) => <li key={index}>
                {item}
                <button onClick={() => removeAt(index)}>删除</button>
            </li>)}
        </ul>
    </div>
}
export { MyToggle, MyList }